@charset "utf-8";

// 单位设置
@unit: 1rem/37.5;

/* 颜色样式 */

// 主要颜色
@base_color: #3b89c0;
@auxiliary_color: #9ec242;
// 字体主色
@ft_base_color: #333;
// 成功
@success_color: #9ec242;
// 警告或提示色
@warn_color: #ed3f14;
// 背景颜色
@bg_color: #f8f8f8;

/* 字体大小 */

// 默认字体大小
@base_ft_size: 14*@unit;

/* 间距高宽*/

// 页面边距
@edge_w: 15;
@navbar_h: 50;

// 默认边框
@base_border: 1*@unit solid #eee;

/* Mixin */

// 圆角设置
.border_radius(@radius) {
    -webkit-border-radius: @radius*@unit;
    -moz-border-radius: @radius*@unit;
    -o-border-radius: @radius*@unit;
    border-radius: @radius*@unit;
}

// 边距设置
.margin(@i, @j){ margin: @i*@unit @j*@unit}
.mt(@edge){ margin-top: @edge*@unit; }
.mb(@edge){ margin-bottom: @edge*@unit; }
.ml(@edge){ margin-left: @edge*@unit; }
.mr(@edge){ margin-right: @edge*@unit; }

.padding(@i, @j){ padding: @i*@unit @j*@unit}
.pt(@edge){ padding-top: @edge*@unit; }
.pb(@edge){ padding-bottom: @edge*@unit; }
.pl(@edge){ padding-left: @edge*@unit; }
.pr(@edge){ padding-right: @edge*@unit; }

.top(@edge){ top: @edge*@unit; }
.bottom(@edge){ bottom: @edge*@unit; }
.left(@edge){ left: @edge*@unit; }
.right(@edge){ right: @edge*@unit; }

// 字体大小
.ft(@font){ font-size: @font*@unit; }

// 高度设置
.ht(@height){ height: @height*@unit; }
.minH(@height){ min-height: @height*@unit; }
.maxH(@height){ max-height: @height*@unit; }

// 宽度设置
.wd(@width){ width: @width*@unit; }
.minW(@width){ min-width: @width*@unit; }
.maxW(@width){ max-width: @width*@unit; }

// 行高设置
.lh(@lineHeight){ line-height: @lineHeight*@unit; }

// 布局设置
.fl{
    float: left;
}

.fr{
    float: right;
}

// 清除浮动
.clr{
    clear: both;
    content: '.';
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
}

// 超出部分省略
.ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}